var swiper = [
    {x:-64, s:.83, z:1},
    {x:140, s:1,   z:2},
    {x:338, s:.83, z:1},
    {x:960, s:.83, z:1},
    {x:960, s:.83, z:1},
    {x:960, s:.83, z:1},
]


function changeSwiperFn()
{
    var swiperSlides = document.querySelectorAll('.swiper .swiper-wrapper .swiper-slide')
    swiperSlides.forEach(function(item, i) {
        item.style.transform="translateX("+swiper[i].x+"px) scale("+swiper[i].s+")"
        item.style.zIndex=swiper[i].z
    })
}
changeSwiperFn()

function next()
{
    // 将数组最后一个值弹出
    var temp = swiper.pop()  // {x:960, s:.83, z:1}
    // 放到前面
    swiper.unshift(temp)
    // 重置所有轮播图的行内样式
    changeSwiperFn()
}

function prev()
{
    // 将数组第一个值弹出
    var temp = swiper.shift()  // {x:960, s:.83, z:1}
    // 放到后面
    swiper.push(temp)
    // 重置所有轮播图的行内样式
    changeSwiperFn()
}

// 下一张
var swiperNext = document.querySelector('.swiper .swiper-next')
swiperNext.onclick = function() {
    next()
}

// 上一张
var swiperPrev = document.querySelector('.swiper .swiper-prev')
swiperPrev.onclick = function() {
    prev()
}

// 点图切换
var swiperSlides = document.querySelectorAll('.swiper .swiper-wrapper .swiper-slide')
swiperSlides.forEach(function(item) {
    item.onclick = function() {
        var style = item.style.transform
        if (style.indexOf('64px') != -1) prev()
        if (style.indexOf('338px') != -1) next()
    }
})

